<!DOCTYPE html>
<html>
<head>
<title>Welcome to awdplaform</title>

    <link rel="stylesheet" href="/static/css/countdown.demo.css">
	<link rel="stylesheet" href="/static/css/bootstrap.css">

	<script src="/static/js/jquery.min.js"></script>
	<script src="/static/js/bootstrap.js"></script>
</head>
<body>
<div class="container">
    <div class="row">
        <nav class="navbar navbar-default" role="navigation">
            <div class="container-fluid">
                <div class="navbar-header">
                <a class="navbar-brand" href="#">Welcome to awdplaform</a>
                </div>
                <div>
                    <ul class="nav navbar-nav">
                        <li class="{% if url_for('index') == request.path %}active{% endif %}"><a href="{{ url_for('index') }}">首页</a></li>
                        <li><a class="about" data-toggle="modal" data-target="#myModal1">队伍信息</a></li>
                        <li><a class="about" data-toggle="modal" data-target="#myModal2">解题提示</a></li>
                        <li><a class="about" data-toggle="modal" data-target="#myModal3">得分情况</a></li>
                        <li><a class="about" data-toggle="modal" data-target="#myModal4">参赛规则</a></li>
                        {%if session.get('user_id') == 'admin'%}
                        <li><a class="about" data-toggle="modal" href="/admin">后台管理</a></li>
                        {%endif%}
                        <li><a class="about" data-toggle="modal" href="/logout">退出登录</a></li>
                    </ul>
                </div>
            </div>
        </nav>
    </div>
</div>
<div class="modal fade" id="myModal1" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
	<div class="modal-dialog">
		<div class="modal-content">
			<div class="modal-header">
				<button type="button" class="close" data-dismiss="modal"
						aria-hidden="true">×
				</button>
				<h4 class="modal-title" id="myModalLabel">
					队伍信息
				</h4>
			</div>
			<div class="modal-body">
                <div class="modal-body">
                	<div class="panel-body">
            		<table class="table">
                      <thead>
                        <tr>
                          <th>TEAM</th>
                          <th>TOKEN</th>
                          <th>SSH-USER</th>
                          <th>SSH-PASS</th>
                          <th>SSH-PORT</th>
                        </tr>
                      </thead>
                      <tbody id="ssh_info">

                      </tbody>
                </table>
            	</div>

			</div>			</div>
			<div class="modal-footer">
				<button type="button" class="btn btn-default"
						data-dismiss="modal">关闭
				</button>
			</div>
		</div><!-- /.modal-content -->
	</div><!-- /.modal-dialog -->
</div><!-- /.modal -->

<div class="modal fade" id="myModal2" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
	<div class="modal-dialog">
		<div class="modal-content">
			<div class="modal-header">
				<button type="button" class="close" data-dismiss="modal"
						aria-hidden="true">×
				</button>
				<h4 class="modal-title" id="myModalLabel">
					解题提示
				</h4>
			</div>
			<div class="modal-body" id="infos">

                <br />
                <br />

			</div>
			<div class="modal-footer">
				<button type="button" class="btn btn-default"
						data-dismiss="modal">关闭
				</button>
			</div>
		</div><!-- /.modal-content -->
	</div><!-- /.modal-dialog -->
</div><!-- /.modal -->

<div class="modal fade" id="myModal3" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
	<div class="modal-dialog">
		<div class="modal-content">
			<div class="modal-header">
				<button type="button" class="close" data-dismiss="modal"
						aria-hidden="true">×
				</button>
				<h4 class="modal-title" id="myModalLabel">
					得分情况
				</h4>
			</div>
			<div class="modal-body">
                	<div class="panel-body">
            		<table class="table">
                      <thead>
                        <tr>
                          <th>ID</th>
                          <th>消息</th>
                          <th>得分</th>
                          <th>轮询次数</th>
                          <th>攻击时间</th>
                        </tr>
                      </thead>
                      <tbody id="rounds">

                      </tbody>
                </table>
            	</div>

			</div>
		</div><!-- /.modal-content -->
	</div><!-- /.modal-dialog -->
</div><!-- /.modal -->

<div class="modal fade" id="myModal4" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
	<div class="modal-dialog">
		<div class="modal-content">
			<div class="modal-header">
				<button type="button" class="close" data-dismiss="modal"
						aria-hidden="true">×
				</button>
				<h4 class="modal-title" id="myModalLabel">
					参赛规则
				</h4>
			</div>
			<div class="modal-body">
                主机信息
                <ul>
                    <li>队伍分配主机，通过指定的端口和密码进行连接</li>
                    <li>主机上运行一个web或多个服务，需要选手保证其可用性审计代码，攻击其他队伍</li>
                    <li>通过漏洞获取其他队伍主机权限，读取服务器上的flag并提交到flag服务器</li>
                </ul>
                攻击检测
                <ul>
                    <li>每次成功攻击，攻击队伍可平分该flag的200分，被攻击者扣除200分，轮询时间1分钟</li>
                    <li>选手需要保证己方服务的可用性，服务故障扣除200分，被服务无故障的队伍平分，轮询时间1分钟</li>
                    <li>得分在下一轮开始时计算</li>
                </ul>
                其他
                <ul>
                    <li>选手可以获取所有的攻击情况以及当前的分数，刷新间隔1分钟</li>
                    <li>不允许使用任何形式的DOS攻击</li>
                </ul>
                <br />
                <br />
			</div>
			<div class="modal-footer">
				<button type="button" class="btn btn-default"
						data-dismiss="modal">关闭
				</button>
			</div>
		</div><!-- /.modal-content -->
	</div><!-- /.modal-dialog -->
</div><!-- /.modal -->

{% block index %}{% endblock %}


<div id="collapseTwo" class="container panel-collapse collapse in">


        <div > <center><h1 class="alt-1" id="mathtimeleft"></h1> <span id="mathtimelabel">距离比赛结束</span></center></div>


    <br>
	
    <div class="panel-body">
        <h1><label id='ctoken'></label></h1>
        <center><h2>当前轮次：<label id='cround'></label> 当前排名：<label id='cround_rank'></label></h2></center>

    		<table class="table">
              <caption></caption>
              <thead>
                <tr>
                    <th>#</th> 
                  <th>TEAM</th>             
                  <th>实时分数</th>
                  <th>环境1</th>
                  <th>环境2</th>
                  <th>环境3</th>
                  <th>环境4</th>
                  <th>环境5</th>
                </tr>
              </thead>
            <tbody id="team">
            </tbody>
        </table>
	</div>
</div>

<div class="container well" style="margin-top: 1%">
    <div class="row">
        <div class="footer text-center">
            <div class="footer-title">
                <h4>提交Flag</h4>
            </div>

            
            <div class="footer-banner" id='flagform'>
                <form method="POST" id="myform" action="flag?token=' + token + '" onsubmit="return submitflag()">
                        <input type="text" name="flag" id="flag">
                        <input type="submit" value="提交">
                </form>
                <label id="msg"></label>
            </div>
            
            <div class="footer-banner">
                <small>自动提交：<label id='mytoken'></label></small>        
            </div>            
        </div>
    </div>
</div>
</body>
</html>

<script type="text/javascript">
    var myname;
    function get_math() {



    $.getJSON('/timedelta',
            function (result) {         

                timeleft = result['timeleft'];
                $("#mathtimeleft").html(timeleft);  
                window.jQuery(function ($) {
                    "use strict";
                    $('.alt-1').countDown({
                        css_class: 'countdown-alt-1'
                    });
                });
            }
            );   


        $.getJSON('/team',
            function (result) {
                $("#ssh_info").html("");
            
                for (x in result){

                    var name = result[x]['name'];
                    myname=name;
                    var token = result[x]['token'];
                    mytoken = token;
                    var score = result[x]['score'];
                    //var ip = result[x]['ip'];
                    var ssh_user = result[x]['ssh-user'];
                    var ssh_password = result[x]['ssh-password'];
                    var ssh_port = result[x]['ssh-port'];
                    var web_port = result[x]['web-port'];
                    $("#ssh_info").append('<tr>'+
                    '<td>'+name+'</td>' +
                    '<td>'+token+'</td>' +
                    '<td>'+ssh_user+'</td>'+
                    '<td>'+ssh_password+'</td>'+
                    '<td>'+ssh_port+'</td>'+
                    '</tr>');
                    $("#myform").attr("action","flag?token=" + token );
                    $("#mytoken").text("curl -d 'flag=flag' http://:9000/flag?token=" + token);
                    $("#ctoken").text('队伍名:' + name + ' Token:' + token);           
                
                }
            }
        );
    }
get_math();                         // 比赛时间、队伍信息 刷新一次
//setInterval('get_math()', 2*1000); // 比赛时间、队伍信息 token 每30秒刷新一次
</script>

<script src="/static/js/jquery.countdown.js"></script> 

<script type="text/javascript">
    var mytoken ;
    function get_temps() {
    $.getJSON('/teams',
        function (result) {
            $("#team").html("");
            for (x in result){
                var name = result[x]['name'];
                var token = result[x]['token'];
                var score = result[x]['score'];
                var rank = result[x]['rank'];
                var port1 = result[x]['port1'];
                var port2 = result[x]['port2'];
                var port3 = result[x]['port3'];
                var port4 = result[x]['port4'];
                var port5 = result[x]['port5'];
                $("#team").append('<tr>'+
                '<td>'+rank+'</td>' +    
                '<td>'+name+'</td>' +
                //'<td>'+token+'</td>'+
                '<td>'+score+'</td>'+
                //'<td>'+ip+'</td>'+
                '<td>'+port1+'</td>'+
                '<td>'+port2+'</td>'+
                '<td>'+port3+'</td>'+
                '<td>'+port4+'</td>'+
                '<td>'+port5+'</td>'+
                '</tr>');

                if(name == myname){
                    $("#cround_rank").html(rank);
                }
            }
        }
    );
    $.getJSON('/rounds',
        function (result) {
            $("#rounds").html("");
            for (x in result){
                var _id = result[x]['id'];
                var msg = result[x]['msg'];
                var score = result[x]['score'];
                var rounds = result[x]['rounds'];
                var time = result[x]['time'];
                $("#rounds").append('<tr>'+
                '<td>'+_id+'</td>' +
                '<td>'+msg+'</td>'+
                '<td>'+score+'</td>'+
                '<td>'+rounds+'</td>'+
                '<td>'+time+'</td>'+
                '</tr>');
            }
        }
    );

    $.getJSON('/current_rounds',
        function (result) {
            $("#cround").html(result);           
        }
    );
    
    
    $.getJSON('/info/2',
        function (result) {
            $("#infos").html("");
            for (x in result){
                var infos = result[x]['id'];
                $("#infos").append('<ul>'+
                '<li>'+infos+'</li>' +
                '</ul>');
                //alert(infos)
            }
            
        }
    );
}
get_temps();
setInterval('get_temps()', 1000); // 队伍情况每一秒刷新一次
</script>

<script>
function submitflag(){
//$('#test').value(mytoken);

/*
$.post('flag?token='+mytoken,
{flag:$("#flag").val()},
function(data,status){
    $("#msg").text(data['msg']);
}
);

*/

$.ajax({
        url:'flag?token='+mytoken,
        data:{flag:$("#flag").val()},
        type : 'post',
        dataType : 'json',  
        success:function(data,status){
            $("#msg").text(data['msg']);
        }
});

return false;
}
//setInterval('submitflag()',1000);

</script>